<#import "/WEB-INF/sys/js_css.html" as js>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
	<#if mansite??>
		<input type="hidden" name="modelid" id="modelid" value="${(mansite.modelid)!''}" />
		<input type="hidden" name="phonemodelid" id="phonemodelid" value="${(mansite.phonemodelid)!''}" />
		<input type="hidden" name="padmodelid" id="padmodelid" value="${(mansite.padmodelid)!''}" />
	</#if>
	<!-- 工具条 -->
	<div id="tools" style="padding:5px;height:auto">
		<a href="javascript:void(0)" id="btn_top_add" class="easyui-linkbutton" iconCls="icon-add" plain="true">增加顶级栏目</a>
	</div>
	<table id="datagrid" class="easyui-treegrid" data-options="singleSelect:true,fit:true,fitColumns:true,pagination:true,
		url:'${ctx}/sys/column/search',toolbar:'#tools',idField:'id',treeField:'colname',rownumbers : true,
		toolbar:'tools'">
	    <thead>
			<tr>
				<th data-options="field:'id',hidden:true">id</th><!-- hidden -->
				<th data-options="field:'entityid',hidden:true">entityid</th><!-- hidden -->
				<th data-options="field:'pnumber',hidden:true">父级编号</th><!-- hidden -->
				<th data-options="field:'createUser',hidden:true">创建人编号</th><!-- hidden -->
				<th data-options="field:'action',align:'center',width:10,formatter:formatterAction">操作</th>
				<th data-options="field:'number',width:15">编号</th>
				<th data-options="field:'colname',width:25">栏目名</th>
				<th data-options="field:'vurl',width:15">访问路径</th><!-- hidden -->
				<th data-options="field:'sort',align:'center',width:5">排序值</th>
				<th data-options="field:'showstatus',align:'center',width:5">状态</th>
				<th data-options="field:'createUserName',align:'center',width:10">创建人</th>
				<th data-options="field:'createTime',align:'center',width:15">创建时间</th>
			</tr>
		</thead>
    </table>
    
    
    
	<!-- 添加栏目信息div -->
	<div id="divpadd" class="easyui-window" title="添加栏目信息" data-options="modal:true,collapsible:false,closed:true,minimizable:false,
		maximizable:false,onClose:divaddclose">
		<form id="topaddform" method="post">
			<input type="hidden" name="id" id="addid" value="" />
			<input type="hidden" name="pnumber" id="addpnumber" value="" />
			<input type="hidden" name="number" id="addnumber" value="" />
			<table class="table table-hover table-condensed">
				<tr>
					<td>栏目名：&nbsp;&nbsp;<input id="addcolname" name="colname" type="text" class="easyui-validatebox" value="" /></td>
					<td>排序值：&nbsp;&nbsp;<input id="addsort" name="sort" type="text" class="easyui-numberbox" data-options="min:1" value="" size="3" /></td>
				</tr>
				<tr>
					<td>访问路径：<input name="vurl" id="addvurl" type="text" class="easyui-validatebox" value="" /></td>
					<td>显示状态：<select class="easyui-combobox" name="showstatus" id="addshowstatus" data-options="panelHeight:'auto'">
								<option value="show" selected>显示</option>
								<option value="hidden">隐藏</option>
					</select></td>
				</tr>
				<tr>
					<td colspan="2"><a href="javascript:void(0)" class="easyui-linkbutton" onclick="jQuery('#add_window_microimg_upload').window('open')" id="btn_window_upload_fengmian" iconCls="icon-save" plain="true">封面上传</a>
					&nbsp;&nbsp;&nbsp;&nbsp;<a class="easyui-tooltip" data-options="hideEvent: 'none', content: function(){return jQuery('#img_show');}, onShow: function(){var t = jQuery(this); t.tooltip('tip').focus().unbind().bind('blur',function(){ t.tooltip('hide');});
                    }">查看缩略图</a><input type="hidden" name="microimgid" id="microimgid" value="" /></td>
				</tr>
				<tr>
					<td colspan="2">PC列表模版：&nbsp;&nbsp;&nbsp;<input name="listmodel" id="addlistmodel" type="text" class="easyui-validatebox" value="" size="50" readonly="readonly" />
					<a href="javascript:void(0)" class="easyui-linkbutton" id="btn_listmodel_brows" data-options="plain:true" onclick="modelbrowe('listmodel')">浏览</a></td>
				</tr>
				<tr>
					<td colspan="2">PC文章模版：&nbsp;&nbsp;&nbsp;<input name="archivesmodel" id="addarchivesmodel" type="text" class="easyui-validatebox" value="" size="50" readonly="readonly" />
					<a href="javascript:void(0)" class="easyui-linkbutton" id="btn_archivesmodel_brows" onclick="modelbrowe('archivesmodel')" data-options="plain:true">浏览</a></td>
				</tr>
				<tr>
					<td colspan="2">phone列表模版：<input name="phonelistmodel" id="addphonelistmodel" type="text" class="easyui-validatebox" value="" size="50" readonly="readonly" />
					<a href="javascript:void(0)" class="easyui-linkbutton" id="btn_phonelistmodel_brows" data-options="plain:true" onclick="modelbrowe('phonelistmodel')">浏览</a></td>
				</tr>
				<tr>
					<td colspan="2">phone文章模版：<input name="phonearchmodel" id="addphonearchmodel" type="text" class="easyui-validatebox" value="" size="50" readonly="readonly" />
					<a href="javascript:void(0)" class="easyui-linkbutton" id="btn_phonearchmodel_brows" onclick="modelbrowe('phonearchmodel')" data-options="plain:true">浏览</a></td>
				</tr>
				<tr>
					<td colspan="2">pad列表模版：&nbsp;&nbsp;<input name="padlistmodel" id="addpadlistmodel" type="text" class="easyui-validatebox" value="" size="50" readonly="readonly" />
					<a href="javascript:void(0)" class="easyui-linkbutton" id="btn_padlistmodel_brows" data-options="plain:true" onclick="modelbrowe('padlistmodel')">浏览</a></td>
				</tr>
				<tr>
					<td colspan="2">pad文章模版：&nbsp;&nbsp;<input name="padarchmodel" id="addpadarchmodel" type="text" class="easyui-validatebox" value="" size="50" readonly="readonly" />
					<a href="javascript:void(0)" class="easyui-linkbutton" id="btn_padarchmodel_brows" onclick="modelbrowe('padarchmodel')" data-options="plain:true">浏览</a></td>
				</tr>
				<tr>
					<td colspan="2" align="center"><a href="javascript:void(0)" class="easyui-linkbutton" id="btn_window_top_add" iconCls="icon-save" plain="true">保存</a></td>
				</tr>
			</table>
		</form>
	</div>
	
	<!-- 文件浏览，模板选择 -->
	<div id="divfileborwe" class="easyui-window" title="模板选择" data-options="modal:true,collapsible:false,closed:true,minimizable:false,
		maximizable:false,width:460,height:300">
		<div id="filetools" style="padding:5px;height:auto">
			<a href="javascript:void(0)" id="browe_btn_save" class="easyui-linkbutton" iconCls="icon-save" plain="true">确定选择</a>
		</div>
		<table id="browsdatagrid">
		    <thead>
				<tr>
					<th data-options="field:'filename',width:100">文件名</th>
				</tr>
			</thead>
	    </table>
	</div>
	<!-- 上传文件信息 -->
	<div id="add_window_microimg_upload" class="easyui-window" title="选择文件" data-options="modal:true,iconCls:'icon-save',closed:true,minimizable:false,maximizable:false,resizable:false">
		<form id="microimg_upload_form" action="${ctx}/sys/file/microimgupload" enctype="multipart/form-data" method="post">
			缩略图选择：<input type="file" id="microimg" name="microimg" value="" onchange="microimgfilter()" />
			<a href="javascript:void(0)" class="easyui-linkbutton" id="microimg_btn_upload" plain="true"">确认上传</a>
		</form>
	</div>
	
	<!-- 缩略图显示 -->
	<div style="display:none">
		<img id="img_show" alt="缩略图" src="" width="400px" />
	</div>
</body>
</html>
<@js.easyui />
<script type="text/javascript">
jQuery(document).ready(function() {
	//确认上传按钮事件
	jQuery("#microimg_btn_upload").click(function(){
		//上传事件验证
		if(jQuery("#microimg").val()==""){
			jQuery.messager.alert("信息","请选择要上传的缩略图！","info");
			return;
		}
		if(!microimgfilter()){
			return;
		}
		jQuery("#microimg_upload_form").form("submit",{
			success:function(data){
				var data = eval("(" + data + ")");
				if(data.error<1){
					jQuery.messager.alert("信息","上传成功！","info",function(){
						jQuery("#img_show").attr("src", data.url);
						jQuery("#microimgid").val(data.id);
					});
				}else{
					jQuery.messager.alert("信息","上传失败！","error");
				}
				jQuery("#add_window_microimg_upload").window("close");
			}
		});
	});
	//添加顶级栏目
	jQuery("#btn_top_add").click(function(){
		jQuery("#divpadd").window("open");
		jQuery("#topaddform").form("clear");
		jQuery("#addshowstatus").combobox("setValue", "show");
		jQuery("#img_show").attr("src", "");
	});
	//保存栏目
	jQuery("#btn_window_top_add").click(function(){
		jQuery("#topaddform").form({
			url:"${ctx}/sys/column/add",
			onSubmit:function(){
				if(!validate())
					return false;
				//证验证重复信息colname sort vurl pnumber
				var servervali = false;
				jQuery.ajax({
		   			async:false,
		   			type:"post",
		   			dataType:"json",
		   			data:{colname:jQuery("#addcolname").val(),sort:jQuery("#addsort").val(),
		   				vurl:jQuery("#addvurl").val(),pnumber:jQuery("#addpnumber").val(),
		   				id:jQuery("#addid").val()},
		   			url:"${ctx}/sys/column/validate",
		   			success:function(date){
		   				if(!date.success){
		   					jQuery.messager.alert("信息",date.message,"error");
		   				}else
		   					servervali = true;
		   			}
		   		});
				return servervali;
			},
			success:function(data){
				if(!data){
					jQuery.messager.alert("信息","保存失败！","error");
					return;
				}
				jQuery.messager.alert("信息","保存成功！","info",function(){
					jQuery("#divpadd").window("close");
				});
				jQuery("#datagrid").treegrid("reload");
			}
		});
		//提交表单
		jQuery('#topaddform').submit();
	});
});
//当关闭添加栏目的时候也关闭模版选择窗口
function divaddclose(){
	jQuery("#divfileborwe").window("close");
	jQuery('#add_window_microimg_upload').window("close");
}
//记录浏览的是列表模版还是内容模版
var pcModel = "listmodel";
//PC浏览模版选择方法
function modelbrowe(islist){
	var model_id = "";
	if(islist=="listmodel"){
		model_id=jQuery("#modelid").val();
	}
	if(islist=="archivesmodel"){
		model_id=jQuery("#modelid").val();
	}
	if(islist=="phonelistmodel"){
		model_id=jQuery("#phonemodelid").val();
	}
	if(islist=="phonearchmodel"){
		model_id=jQuery("#phonemodelid").val();
	}
	if(islist=="padlistmodel"){
		model_id=jQuery("#padmodelid").val();
	}
	if(islist=="padarchmodel"){
		model_id=jQuery("#padmodelid").val();
	}
	pcModel = islist;
	jQuery("#divfileborwe").window("open");
	//模板文件读取
	jQuery("#browsdatagrid").datagrid({
		url:"${ctx}/sys/model/themes?id="+model_id,
		singleSelect:true,
		fit:true,
		fitColumns:true,
		rownumbers:true,
		toolbar:"filetools"
	});
	jQuery("#browe_btn_save").click(function(){
		browebtnsavefun();
	});
}
//选择确定模板文件事件
function browebtnsavefun(){
	var brow = jQuery("#browsdatagrid").datagrid("getSelected");
	if(!brow){
		jQuery.messager.alert("信息","请选择一个模版！","info");
		return;
	}
	if(pcModel=="listmodel"){
		jQuery("#addlistmodel").val(brow.filename);
	}
	if(pcModel=="archivesmodel"){
		jQuery("#addarchivesmodel").val(brow.filename);
	}
	if(pcModel=="phonelistmodel"){
		jQuery("#addphonelistmodel").val(brow.filename);
	}
	if(pcModel=="phonearchmodel"){
		jQuery("#addphonearchmodel").val(brow.filename);
	}
	if(pcModel=="padlistmodel"){
		jQuery("#addpadlistmodel").val(brow.filename);
	}
	if(pcModel=="padarchmodel"){
		jQuery("#addpadarchmodel").val(brow.filename);
	}
	jQuery("#divfileborwe").window("close");
}
//验证表单信息
function validate(){
	if(jQuery("#addcolname").val()==""){
		jQuery.messager.alert("信息","请填写栏目信息！","info");
		return false;
	}
	if(jQuery("#addsort").val()==""){
		jQuery.messager.alert("信息","请填写排序值！","info");
		return false;
	}
	if(jQuery("#addvurl").val()==""){
		jQuery.messager.alert("信息","请填写访问路径！","info");
		return false;
	}
	return true;
}
//操作单元格信息
function formatterAction(value,row,index){
	return "<img title='预览此栏目' src='${ctx}/js/easyui/themes/icons/search.png' />&nbsp;&nbsp;"+
	"<img title='添加子栏目' onclick='addChildfun(\""+row.number+"\")' src='${ctx}/js/easyui/themes/icons/edit_add.png' />&nbsp;&nbsp;"+
	"<img title='更改此栏目' onclick='editfun(\""+row.entityid+"\")' src='${ctx}/js/easyui/themes/icons/pencil.png' />&nbsp;&nbsp;"+
	"<img title='删除此栏目' onclick='deletefun(\""+row.entityid+"\")' src='${ctx}/js/easyui/themes/icons/edit_remove.png' />";
}
//修改栏目信息
function editfun(id){
	jQuery.ajax({
		async:false,
		type:"post",
		dataType:"json",
		data:{id:id},
		url:"${ctx}/sys/column/bean",
		success:function(date){
			if(!date.success){
				jQuery.messager.alert("信息",date.message,"error");
				return;
			}
			var bean = date.bean;
			jQuery("#divpadd").window("open");
			jQuery("#topaddform").form("clear");
			jQuery("#img_show").attr("src", "");
			
			jQuery("#addid").val(bean.id);
			jQuery("#addpnumber").val(bean.pnumber);
			jQuery("#addnumber").val(bean.number);
			jQuery("#addcolname").val(bean.colname);
			jQuery("#addsort").numberbox("setValue", bean.sort);
			jQuery("#addvurl").val(bean.vurl);
			jQuery("#addshowstatus").combobox("setValue", bean.showstatus);
			//模板信息
			jQuery("#addlistmodel").val(bean.listmodel);
			jQuery("#addarchivesmodel").val(bean.archivesmodel);
			jQuery("#addphonelistmodel").val(bean.phonelistmodel);
			jQuery("#addphonearchmodel").val(bean.phonearchmodel);
			jQuery("#addpadlistmodel").val(bean.padlistmodel);
			jQuery("#addpadarchmodel").val(bean.padarchmodel);
			//缩略图信息
			jQuery("#microimgid").val(bean.imgid);
			jQuery("#img_show").attr("src", bean.imgsrc);
		}
	});
}
//删除
function deletefun(id){
	jQuery.messager.confirm("信息","此操作将删除栏目下的所有文章，您确定要删除？",function(arg){
		if(!arg)
			return;
		jQuery.ajax({
			async:false,
			type:"post",
			dataType:"json",
			data:{id:id},
			url:"${ctx}/sys/column/delete",
			success:function(date){
				if(!date.success){
					jQuery.messager.alert("信息",date.message,"error");
					return;
				}
				//刷新页面
				jQuery("#datagrid").treegrid("reload");
			}
		});
	});
}
//添加子栏目
function addChildfun(number){
	jQuery("#divpadd").window("open");
	jQuery("#topaddform").form("clear");
	
	jQuery("#addpnumber").val(number);
	jQuery("#addshowstatus").combobox("setValue", "show");
}
//缩略图上传限制
function microimgfilter(){
	var file = document.getElementById("microimg");
	var fileName = file.value;
	var file_typename = fileName.substring(fileName.lastIndexOf('.'), fileName.length);
	if (!(file_typename == '.jpg'||file_typename == '.png')) {
		file.value="";
		jQuery.messager.alert("信息","请上传jpg与png格式的缩略图！");
		file.value="";
		return false;
	}
	return true;
}
</script>